<script>
import postInfo from "@/view/postInfo.vue";
export default {
  name: 'CommentTree',
  computed: {
    postInfo() {
      return postInfo
    }
  },
  props: {
    treeData: Array
  },
}

</script>

<template>
  <ul class="post_comment_item" >
    <li v-for="(item,index) in treeData" :key="index">
      <div class="post_comment_user"><span style="color:#209361;margin: 0 10px 0 0">{{item.commentUserName}}</span>发布于
        <p style="color:#979797">{{new Date(item.commentCreateTime)}}</p></div>
      <div class="post_comment_content">
        <div v-html="item.commentContent"></div>
      </div>

      <div class="comment_reply"  style="display: flex;">
        <input class="reply_content" type="text" style="border: 1px solid gray" >
        <button class="reply_button" @click="postInfo.methods.sendComment(item.id,item.replyContent)">回复
        </button>
      </div>

      <ul class="post_comment_comment">
        <li style="padding-left: 10px;margin: 5px">
          <comment-tree :tree-data="item.whatCommentDTOList"></comment-tree>
        </li>
      </ul>
    </li>
  </ul>
</template>

<style scoped>

</style>